<?php
$activity = $this->context->activity;
$this->title = $model->title;

use yii\helpers\Html; ?>


<?= \frontend\widgets\Swiper::widget(['model' => $activity]) ?>

<style>

    .tc {
        text-align: center;
    }

    .player_title {
        text-align: center;
        font-size: 18px;
        border-bottom: 1px solid #dddddd;
        padding-bottom: 20px;
        margin-left: 20px;
        margin-right: 20px;
    }

    .player_data_val {
        color: black;
        font-weight: bold;
        font-size: 14px;
    }

    .player_data_label {
        margin: 0;
        padding: 0;
        color: gray;
        font-size: 12px;
        text-align: center;
    }

    .o_rank {
        width: 60px;
        height: 60px;
        line-height: 60px;
        display: inline-block;
        border-radius: 30px;
        font-size: 24px;
        font-weight: bold;
    }

    .c0 {
        margin: 0;
        padding: 0;
    }

    .fans_warper {
        width: 100%;
        height: 90px;
        overflow-x: scroll;
        white-space: nowrap;
    }

    .fans_item {
        display: inline-block;
        text-align: center;
        margin-right: 10px;
    }

    .fans_avatar {
        width: 60px;
        height: 60px;
        border-radius: 30px;
    }

    .gift_warper {
        margin: 10px;
        min-height: 240px;
        background-color: lavender;
    }

    .gift_item {
        padding: 10px;
        margin: 0;
    }

    .gift_user {
        width: 40px;
        height: 40px;
        border-radius: 20px;
    }

    .gift_img {
        width: 20px;
        height: 20px;
    }

    .action_warper {
        width: 100%;
        position: fixed;
        bottom: 45px;
        padding: 10px;
        left: 0;
        text-align: center;
        background-color: rgba(222, 222, 222, 0.5);
    }


</style>


<div class="container-fluid">
    <div class="r4_card">
        <p class="player_title"><?= $model->title ?></p>

        <div class="row">
            <div class="col-xs-3">
                <p class="player_data_label player_data_val"><span id="obtain_vote_number"><?= $model->total_vote_number ?></span></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Obtain Vote Number') ?></p>
            </div>
            <div class="col-xs-3 separator">
                <p class="player_data_label player_data_val"><?= $model->share_number ?></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Share Number') ?></p>
            </div>
            <div class="col-xs-3 separator">
                <p class="player_data_label player_data_val"><?= $model->view_number ?></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'View Number') ?></p>
            </div>
            <div class="col-xs-3 separator">
                <p class="player_data_label player_data_val"><?= $model->gift_vote_number ?></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Gift Number') ?></p>
            </div>
        </div>

        <?php
        $data = $model->getRankDiff();
        ?>

        <div class="row" style="margin-top: 40px;margin-bottom: 10px">
            <div class="col-xs-4 tc">
                <p class="player_data_label player_data_val"><?= $data->before_vote_number ?></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Ranking Before') ?></p>
            </div>
            <div class="col-xs-4 tc">
                <div class="o_rank main-bg-color white-font">
                    <?= $data->current_rank ?>
                </div>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Ranking') ?></p>
            </div>
            <div class="col-xs-4 tc">
                <p class="player_data_label player_data_val"><?= $data->after_vote_number ?></p>
                <p class="player_data_label"><?= Yii::t('app.c2', 'Ranking After') ?></p>
            </div>
        </div>

        <img class="w100" src="<?= $model->getThumbnailUrl(); ?>">

        <div class="content">
            <?= $model->content; ?>
        </div>

    </div>


    <div class="r4_card" style="margin-top: 10px;margin-bottom: 40px">

        <p class="main-font-color p_title"><?= Yii::t('app.c2', 'Fans Items') ?></p>

        <div class="fans_warper">
            <?php foreach ($model->getFreeVote() as $item): ?>
                <div class="fans_item">
                    <img class="fans_avatar" src="<?= $item['attachment'] ?>">
                    <p class="c0"><?= $item['username'] ?></p>
                </div>
            <?php endforeach; ?>
        </div>

        <p class="main-font-color p_title"><?= Yii::t('app.c2', 'Gift Items') ?></p>

        <div class="gift_warper">
            <div class="row gift_item">
                <?php foreach ($model->getGiftVote() as $item): ?>
                    <div class="gift_username">
                        <img src="<?= $item['user_attachment'] ?>" class="gift_user">
                        <?= Yii::t('app.c2', '{s1} Give Gift', [
                            's1' => $item['username']
                        ]) ?>
                        <img src="<?= $item['gift_attachment'] ?>" class="gift_img">
                        <?= Yii::t('app.c2', 'Add {s1} Vote', [
                            's1' => $item['vote_number']
                        ]) ?>
                    </div>
                <?php endforeach; ?>
            </div>

        </div>


        <div class="content">
            <p class="main-font-color p_title"><?= Yii::t('app.c2', 'Activity Introduction') ?></p>
            <?= $activity->content ?>
        </div>
    </div>
</div>


<div class="action_warper">
    <div class="row">
        <div class="col-xs-4">
            <?= Html::a(Yii::t('app.c2', 'Poster'), [
                    '/'
            ], ['class' => 'btn white-bg black-font btn-block']) ?>
        </div>
        <div class="col-xs-4">
            <?= Html::a(Yii::t('app.c2', 'Gift It'), [
                '/'
            ], ['class' => 'btn main-bg-color white-font btn-block']) ?>
        </div>
        <div class="col-xs-4">
            <?= Html::a(Yii::t('app.c2', 'Vote It'), 'javascript:;', ['class' => 'btn white-bg black-font btn-block', 'id' => 'free_vote']) ?>
        </div>
    </div>
</div>

<?php

\yii\bootstrap\Modal::begin([
    'id' => 'content-modal',
    'header' => '<p class="modal-title"></p>',
    // 'footer' => '<a href="#" class="btn btn-primary" data-dismiss="modal">Close</a>',
]);

\yii\bootstrap\Modal::end();

$js = <<< JS

$('#free_vote').on('click', function(e) {
  // $.post('/site/vote', {id:"{$model->id}"}, function(res) {
  //   if (res) {
  //       if (res._meta.result === '0000') {
  //           $('#total-vote-number').html(res._data.total_vote_number);
  //       }
  //       $('#content-modal').find('.modal-title').html('提示');
  //       $('#content-modal').modal('show').find('.modal-body').html(res._meta.message);
  //   }
  // })
  
  $.ajax({
    type: 'post',
    url: '/player/default/vote',
    dataType: 'json',
    data: {id:"{$model->id}"},
    beforeSend: function() {
          window.top.window.showLoading();
    },
    success: function(res) {
          if (res) {
            if (res.meta.result === '0000') {
                $('#obtain_vote_number').html(res.data);
            }
            $('#content-modal').find('.modal-title').html('提示');
            $('#content-modal').modal('show').find('.modal-body').html(res.meta.message);
        }
    },
    error: function(res) {
      if (res.status === 500) {
          $('#content-modal').find('.modal-title').html('提示');
          // $('#content-modal').modal('show').find('.modal-body').html(res.responseText);
          $('#content-modal').modal('show').find('.modal-body').html('服务器开小差');
      } 
    },
    complete: function() {
        window.top.window.hideLoading();
    }
  })
  
})
JS;

$this->registerJs($js);

?>


<script type="text/javascript">
    wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
        //shareData 参数记得为字符串类型
        var shareData = {
            title: '<?= $model->title ?>',
            desc: '<?= Html::encode($model->title) ?>',//这里请特别注意是要去除html
            link: '<?= Yii::$app->request->hostInfo . Yii::$app->request->url ?>',//域名必须JS安全域名
            imgUrl: '<?= $model->getThumbnailUrl() ?>',
            success: function () {

            },
            cancel: function () {
                console.log('cancel')
            }
        };

        if (wx.onMenuShareAppMessage) { //微信文档中提到这两个接口即将弃用，故判断
            wx.onMenuShareAppMessage(shareData);//1.0 分享到朋友
            wx.onMenuShareTimeline(shareData);//1.0分享到朋友圈
        } else {
            wx.updateAppMessageShareData(shareData);//1.4 分享到朋友
            wx.updateTimelineShareData(shareData);//1.4分享到朋友圈
        }

    });
</script>
